1.10 js对DOM树的阻塞
1、 DOM:js操作网页的接口，全称该文档对象模型（Document Object Model）,可以理解成页面中的元素。
2、 Dom树：元素和元素之间的关素，可在简单理解成页面的结构。
3、 Js的执行会阻塞页面结构的加载，此时Dom树是不完整的。这样在调用一些js代码时就可能报错。
4、 防止阻塞的方法：
1） 把所有的js代码入在body区域的最后
2） 添加window.onload事件，表示网页加载完毕后（包括图片，Css文件等等）执行的操作。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
var abc=document.getElementById("zxw");
abc.style.color="red";
</script>
</head>
<body>
<div id="zxw">我要好好学习</div>
</body>
</html>
如下，会出现报错：
1、把所有的js代码入在body区域的最后
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="zxw">我要好好学习</div>
<script type="text/javascript">
var abc=document.getElementById("zxw");
abc.style.color="red";
</script>
</body>
</html>
2、添加window.onload事件，表示网页加载完毕后（包括图片，Css文件等等）执行的操作。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
window.onload = function(){
var abc=document.getElementById("zxw");
abc.style.color="red";
};
</script>
</head>
<body>
<div id="zxw">我要好好学习</div>
</body>
</html>